import { RouteRecordRaw } from 'vue-router'
import { constantRoutes } from '@/router'
import { Commit } from 'vuex'
import Layout from '@/layout/AppMain.vue'

export interface IPermission {
  routes:Array<RouteRecordRaw>
  asyncRoutes:Array<RouteRecordRaw>
}

const state:IPermission = {
  routes: [],
  asyncRoutes: []
}

const mutations = {
  SET_ROUTES: (state:IPermission, routes:Array<RouteRecordRaw>) => {
    state.asyncRoutes = routes
    state.routes = constantRoutes.concat(routes)
  }
}

const actions = {
  generateRoutes (context: { commit: Commit }) {
    return new Promise(resolve => {
      const accessedRoutes : Array<RouteRecordRaw> = [
        {
          path: '/examples',
          name: 'examples',
          component: Layout,
          redirect: '/examples/table',
          meta: { title: '示例', hidden: false, alwaysShow: true },
          children: [
            {
              path: 'table',
              name: 'table',
              component: () => import('@/views/examples/table.vue'),
              meta: { title: '表格2', hidden: false }
            }
          ]
        }
      ]
      context.commit('SET_ROUTES', accessedRoutes)
      // 1... 请求后台菜单
      resolve(accessedRoutes)
    })
  }
}
const getters = {
  get_routes: (state:IPermission) => state.routes
}

export const permission = {
  namespace: true,
  state,
  mutations,
  actions,
  getters
}
